import React from 'react'
import PropTypes from 'prop-types'
import { Table, Modal, Badge } from 'antd'
import classnames from 'classnames'
import { randomColor } from 'config'
import { DropOption } from 'components'
import AnimTableBody from 'components/DataTable/AnimTableBody'
import styles from './List.less'


const { confirm } = Modal

const List = ({
  onDeleteItem, onLeaveItem, onEditItem, isMotion, location, ...tableProps
}) => {

  const handleMenuClick = (record, e) => {
    if (e.key === 'edit') {
      onEditItem(record)
    } else if (e.key === 'view') {
      onEditItem(record, true)
    } else if (e.key === 'delete') {
      confirm({
        title: '您确定要删除这条数据吗?',
        okText: '确定',
        cancelText: '取消',
        onOk() {
          onDeleteItem(record.id)
        },
      })
    }
  }

  const getAvatarText = (realName) => {
    return realName ? realName.substr(realName.length - 1, realName.length) : ""
  }


  const statusMap = ['success', 'error']
  const status = ['上架', '下架']

  const columns = [
    {
      title: '订单编号',
      dataIndex: 'orderSn',
      key: 'orderSn',
    }, {
      title: '编辑前内容',
      dataIndex: 'goodsName',
      key: 'goodsName',
      // render: emp => emp ? emp.username : "-",
    }, {
      title: '操作员工',
      dataIndex: 'processEmpName',
      key: 'processEmpName',
    }, {
      title: '所属部门',
      dataIndex: 'saleNum',
      key: 'saleNum',
    }, {
      title: '编辑时间',
      dataIndex: 'processTime',
      key: 'processTime',
    },
  ]

  const AnimateBody = (props) => {
    return <AnimTableBody {...props} />
  }

  const CommonBody = (props) => {
    return <tbody {...props} />
  }

  return (
    <Table
      {...tableProps}
      className={classnames(styles.table, { [styles.motion]: isMotion })}
      scroll={{ x: 1000 }}
      columns={columns}
      simple
      rowKey={record => record.id}
      components={{
        body: { wrapper: isMotion ? AnimateBody : CommonBody },
      }}
    />
  )
}

List.propTypes = {
  onDeleteItem: PropTypes.func,
  onEditItem: PropTypes.func,
  isMotion: PropTypes.bool,
  location: PropTypes.object,
}

export default List
